<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>研究生招生系统 - 学科秘书管理页面</title>
    {% load static %}
    <link rel="stylesheet" href="../static/css/styles.css">
    <link rel="stylesheet" href="../static/plugins/bootstrap-5.3.0-alpha1-dist/css/bootstrap.min.css">
    <script src="../static/plugins/bootstrap-5.3.0-alpha1-dist/js/bootstrap.bundle.min.js"></script>
</head>

<body>
{% if error_msg %}
    <div class="alert alert-danger" role="alert">
        {{ error_msg }}
    </div>
{% endif %}
<nav class="navbar navbar-expand-lg navbar-light bg-light">
    <div class="container">
        <a class="navbar-brand" href="#">
            <img src="../static/img/bjfu.png" alt="Bootstrap" width="252" height="61">
        </a>
        <h3 class="navbar-text ms-auto">北京林业大学研究生招生系统 - 学科秘书管理页面</h3>
    </div>
</nav>

<div class="container-fluid">
    <div class="row">
        <!-- 侧边导航栏 -->
        <div class="col-md-2 d-none d-md-block">
            <div class="sidebar">
                <nav>
                    <ul class="nav flex-column">
                        <li class="nav-item">
                            <a class="nav-link text-green" href="#" data-section="subjects" id="subjects-tab">学科信息</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-green" href="#" data-section="students" id="students-tab">考生信息</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#" data-section="admissions">招生信息</a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
        <!-- 主内容区域 -->
        <div class="col-md-9">
            <div class="tab-content" id="myTabContent">
                <div class="tab-pane fade show active" id="subjects" role="tabpanel" aria-labelledby="subjects-tab">
                    <h2>学科信息</h2>
                    <div class="d-flex justify-content-between mb-3">
                        <button class="btn btn-success" id="add-subject-btn" data-bs-toggle="modal" data-bs-target="#addSubjectModal">增加科目</button>
                        <input type="text" id="search-input" class="form-control w-50" placeholder="搜索科目...">
                    </div>
                    <div class="card">
                        <div class="card-body">
                            <table class="table table-striped table-bordered">
                                <thead>
                                    <tr>
                                        <th>科目ID</th>
                                        <th>科目名称</th>
                                        <th>科目级别</th>
                                        <th>父科目</th>
                                        <th>科目概述</th>
                                        <th>科目类型</th>
                                        <th>操作</th>
                                    </tr>
                                </thead>
                                <tbody id="subjects-table-body">
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <!-- 编辑科目的模态框 -->
                    <div class="modal fade" id="editSubjectModal" tabindex="-1" aria-labelledby="editSubjectModalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h5 class="modal-title" id="editSubjectModalLabel">编辑科目</h5>
                                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                </div>
                                <div class="modal-body">
                                    <form id="edit-subject-form">
                                        <input type="hidden" id="edit_subject_id">
                                        <div class="mb-3">
                                            <label for="edit_subject_name" class="form-label">科目名称</label>
                                            <input type="text" class="form-control" id="edit_subject_name" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="edit_subject_level" class="form-label">科目级别</label>
                                            <input type="text" class="form-control" id="edit_subject_level" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="edit_parent_subject" class="form-label">父科目</label>
                                            <input type="text" class="form-control" id="edit_parent_subject">
                                        </div>
                                        <div class="mb-3">
                                            <label for="edit_subject_overview" class="form-label">科目概述</label>
                                            <textarea class="form-control" id="edit_subject_overview"></textarea>
                                        </div>
                                        <div class="mb-3">
                                            <label for="edit_subject_type" class="form-label">科目类型</label>
                                            <input type="text" class="form-control" id="edit_subject_type" required>
                                        </div>
                                    </form>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
                                    <button type="button" class="btn btn-primary" id="update-subject-btn">保存更改</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- 增加科目的模态框 -->
                    <div class="modal fade" id="addSubjectModal" tabindex="-1" aria-labelledby="addSubjectModalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h5 class="modal-title" id="addSubjectModalLabel">增加科目</h5>
                                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                </div>
                                <div class="modal-body">
                                    <form id="add-subject-form">
                                        <div class="mb-3">
                                            <label for="subject_id" class="form-label">科目ID</label>
                                            <input type="text" class="form-control" id="subject_id" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="subject_name" class="form-label">科目名称</label>
                                            <input type="text" class="form-control" id="subject_name" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="subject_level" class="form-label">科目级别</label>
                                            <input type="text" class="form-control" id="subject_level" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="parent_subject" class="form-label">父科目</label>
                                            <input type="text" class="form-control" id="parent_subject">
                                        </div>
                                        <div class="mb-3">
                                            <label for="subject_overview" class="form-label">科目概述</label>
                                            <textarea class="form-control" id="subject_overview"></textarea>
                                        </div>
                                        <div class="mb-3">
                                            <label for="subject_type" class="form-label">科目类型</label>
                                            <input type="text" class="form-control" id="subject_type" required>
                                        </div>
                                    </form>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
                                    <button type="button" class="btn btn-primary" id="save-subject-btn">保存</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="tab-pane fade" id="students" role="tabpanel" aria-labelledby="students-tab">
                    <h2>考生信息</h2>
                    <div class="d-flex justify-content-between mb-3">
                        <button class="btn btn-success" id="add-student-btn" data-bs-toggle="modal" data-bs-target="#addStudentModal">增加考生</button>
                        <input type="text" id="search-input-student" class="form-control w-50" placeholder="搜索考生...">
                    </div>
                    <div class="card">
                        <div class="card-body">
                            <table class="table table-striped table-bordered">
                                <thead>
                                    <tr>
                                        <th>学号</th>
                                        <th>姓名</th>
                                        <th>考号</th>
                                        <th>生源地</th>
                                        <th>本科专业</th>
                                        <th>本科学校</th>
                                        <th>邮箱</th>
                                        <th>电话</th>
                                        <th>操作</th>
                                    </tr>
                                </thead>
                                <tbody id="students-table-body">
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <!-- 增加考生的模态框 -->
                    <div class="modal fade" id="addStudentModal" tabindex="-1" aria-labelledby="addStudentModalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h5 class="modal-title" id="addStudentModalLabel">增加考生</h5>
                                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                </div>
                                <div class="modal-body">
                                    <form id="add-student-form">
                                        <div class="mb-3">
                                            <label for="idnumber" class="form-label">学号</label>
                                            <input type="text" class="form-control" id="idnumber" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="name" class="form-label">姓名</label>
                                            <input type="text" class="form-control" id="name" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="examnumber" class="form-label">考号</label>
                                            <input type="text" class="form-control" id="examnumber" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="origin" class="form-label">生源地</label>
                                            <input type="text" class="form-control" id="origin">
                                        </div>
                                        <div class="mb-3">
                                            <label for="undergradmajor" class="form-label">本科专业</label>
                                            <input type="text" class="form-control" id="undergradmajor">
                                        </div>
                                        <div class="mb-3">
                                            <label for="undergradschool" class="form-label">本科学校</label>
                                            <input type="text" class="form-control" id="undergradschool">
                                        </div>
                                        <div class="mb-3">
                                            <label for="email" class="form-label">邮箱</label>
                                            <input type="email" class="form-control" id="email">
                                        </div>
                                        <div class="mb-3">
                                            <label for="phone" class="form-label">电话</label>
                                            <input type="text" class="form-control" id="phone">
                                        </div>
                                    </form>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
                                    <button type="button" class="btn btn-primary" id="save-student-btn">保存</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- 编辑考生的模态框 -->
                    <div class="modal fade" id="editStudentModal" tabindex="-1" aria-labelledby="editStudentModalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h5 class="modal-title" id="editStudentModalLabel">编辑考生</h5>
                                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                </div>
                                <div class="modal-body">
                                    <form id="edit-student-form">
                                        <input type="hidden" id="edit_idnumber">
                                        <div class="mb-3">
                                            <label for="edit_name" class="form-label">姓名</label>
                                            <input type="text" class="form-control" id="edit_name" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="edit_examnumber" class="form-label">考号</label>
                                            <input type="text" class="form-control" id="edit_examnumber" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="edit_origin" class="form-label">生源地</label>
                                            <input type="text" class="form-control" id="edit_origin">
                                        </div>
                                        <div class="mb-3">
                                            <label for="edit_undergradmajor" class="form-label">本科专业</label>
                                            <input type="text" class="form-control" id="edit_undergradmajor">
                                        </div>
                                        <div class="mb-3">
                                            <label for="edit_undergradschool" class="form-label">本科学校</label>
                                            <input type="text" class="form-control" id="edit_undergradschool">
                                        </div>
                                        <div class="mb-3">
                                            <label for="edit_email" class="form-label">邮箱</label>
                                            <input type="email" class="form-control" id="edit_email">
                                        </div>
                                        <div class="mb-3">
                                            <label for="edit_phone" class="form-label">电话</label>
                                            <input type="text" class="form-control" id="edit_phone">
                                        </div>
                                    </form>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
                                    <button type="button" class="btn btn-primary" id="update-student-btn">保存更改</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tab-pane fade" id="admissions" role="tabpanel" aria-labelledby="admissions-tab">
                    <h2>招生信息</h2>
                    <div class="d-flex justify-content-between mb-3">
                        <button class="btn btn-success" id="add-admission-btn" data-bs-toggle="modal" data-bs-target="#addAdmissionModal">增加招生信息</button>
                        <input type="text" id="search-input-admission" class="form-control w-50" placeholder="搜索招生信息...">
                    </div>
                    <div class="card">
                        <div class="card-body">
                            <table class="table table-striped table-bordered">
                                <thead>
                                    <tr>
                                        <th>科目ID</th>
                                        <th>方向</th>
                                        <th>初试学科</th>
                                        <th>复试学科</th>
                                        <th>年度招生计划</th>
                                        <th>额外招生计划</th>
                                        <th>招生年份</th>
                                        <th>是否有招生资格</th>
                                        <th>导师ID</th>
                                        <th>操作</th>
                                    </tr>
                                </thead>
                                <tbody id="admissions-table-body">
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <!-- 增加招生信息的模态框 -->
                    <div class="modal fade" id="addAdmissionModal" tabindex="-1" aria-labelledby="addAdmissionModalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h5 class="modal-title" id="addAdmissionModalLabel">增加招生信息</h5>
                                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                </div>
                                <div class="modal-body">
                                    <form id="add-admission-form">
                                        <div class="mb-3">
                                            <label for="admission-subjectid" class="form-label">科目ID</label>
                                            <input type="text" class="form-control" id="add-admission-subjectid" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-subjectdirection" class="form-label">方向</label>
                                            <input type="text" class="form-control" id="add-admission-subjectdirection" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-subjectexam" class="form-label">初试学科</label>
                                            <input type="text" class="form-control" id="add-admission-subjectexam" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-subjectretest" class="form-label">复试学科</label>
                                            <input type="text" class="form-control" id="add-admission-subjectretest" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-annualquota" class="form-label">年度招生计划</label>
                                            <input type="text" class="form-control" id="add-admission-annualquota" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-extraquota" class="form-label">额外招生计划</label>
                                            <input type="text" class="form-control" id="add-admission-extraquota" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-year" class="form-label">招生年份</label>
                                            <input type="text" class="form-control" id="add-admission-year" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-eligible" class="form-label">是否有招生资格</label>
                                            <input type="text" class="form-control" id="add-admission-eligible" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-instructorid" class="form-label">导师ID</label>
                                            <input type="text" class="form-control" id="add-admission-instructorid" required>
                                        </div>
                                    </form>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
                                    <button type="button" class="btn btn-primary" id="save-admission-btn">保存</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- 编辑招生信息的模态框 -->
                    <div class="modal fade" id="editAdmissionModal" tabindex="-1" aria-labelledby="editAdmissionModalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h5 class="modal-title" id="editAdmissionModalLabel">编辑招生信息</h5>
                                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                </div>
                                <div class="modal-body">
                                    <form id="edit-admission-form">
                                        <input type="hidden" id="admission-id">
                                        <div class="mb-3">
                                            <label for="admission-subjectid" class="form-label">科目ID</label>
                                            <input type="text" class="form-control" id="admission-subjectid" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-subjectdirection" class="form-label">方向</label>
                                            <input type="text" class="form-control" id="admission-subjectdirection" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-subjectexam" class="form-label">初试学科</label>
                                            <input type="text" class="form-control" id="admission-subjectexam" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-subjectretest" class="form-label">复试学科</label>
                                            <input type="text" class="form-control" id="admission-subjectretest" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-annualquota" class="form-label">年度招生计划</label>
                                            <input type="text" class="form-control" id="admission-annualquota" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-extraquota" class="form-label">额外招生计划</label>
                                            <input type="text" class="form-control" id="admission-extraquota" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-year" class="form-label">招生年份</label>
                                            <input type="text" class="form-control" id="admission-year" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-eligible" class="form-label">是否有招生资格</label>
                                            <input type="text" class="form-control" id="admission-eligible" required>
                                        </div>
                                        <div class="mb-3">
                                            <label for="admission-instructorid" class="form-label">导师ID</label>
                                            <input type="text" class="form-control" id="admission-instructorid" required>
                                        </div>
                                    </form>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
                                    <button type="button" class="btn btn-primary" id="update-admission-btn">保存更改</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tab-pane fade" id="review_subjects" role="tabpanel" aria-labelledby="review_subjects-tab">
                    <h2>审核学科信息</h2>
                    <div class="card">
                        <div class="card-body">
                            <table class="table table-striped table-bordered">
                                <thead>
                                    <tr>
                                        <th>科目ID</th>
                                        <th>科目名称</th>
                                        <th>状态</th>
                                        <th>操作</th>
                                    </tr>
                                </thead>
                                <tbody id="review-subjects-table-body">
                                    <!-- Data will be loaded here -->
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    const sections = document.querySelectorAll('.tab-pane');
    const links = document.querySelectorAll('.nav-link');

    links.forEach(link => {
        link.addEventListener('click', (e) => {
            e.preventDefault();
            const sectionId = link.getAttribute('data-section');
            sections.forEach(section => {
                section.classList.remove('show', 'active');
            });
            document.getElementById(sectionId).classList.add('show', 'active');
        });
    });

    // 初始化页面加载时显示学科信息
    const subjectsTab = document.getElementById('subjects-tab');
    subjectsTab.click();

    // 获取学科信息
    fetch('http://127.0.0.1:8000/sub')
        .then(response => response.json())
        .then(data => {
            const subjectsTableBody = document.getElementById('subjects-table-body');
            subjectsTableBody.innerHTML = ''; // 清空表格内容

            // 添加搜索功能的事件监听器
            const searchInput = document.getElementById('search-input');
            searchInput.addEventListener('input', () => {
                const searchTerm = searchInput.value.toLowerCase();
                const rows = subjectsTableBody.querySelectorAll('tr');
                rows.forEach(row => {
                    const subjectName = row.querySelector('td:nth-child(2)').textContent.toLowerCase();
                    row.style.display = subjectName.includes(searchTerm) ? '' : 'none';
                });
            });

            data.subjects_info.forEach(subject => {
                const row = document.createElement('tr');
                row.innerHTML = `
                <td>${subject.subject_id}</td>
                <td>${subject.subject_name}</td>
                <td>${subject.subject_level}</td>
                <td>${subject.parent_subject}</td>
                <td>${subject.subject_overview}</td>
                <td>${subject.subject_type}</td>
                <td>
                    <button class="btn btn-warning btn-sm" onclick="editSubject('${subject.subject_id}')">修改</button>
                    <button class="btn btn-danger btn-sm" onclick="deleteSubject('${subject.subject_id}')">删除</button>
                </td>
            `;
                subjectsTableBody.appendChild(row);
            });
        })
        .catch(error => console.error('Error:', error));

    // 添加学科
    document.getElementById('save-subject-btn').addEventListener('click', () => {
        const subjectId = document.getElementById('subject_id').value;
        const subjectName = document.getElementById('subject_name').value;
        const subjectLevel = document.getElementById('subject_level').value;
        const parentSubject = document.getElementById('parent_subject').value;
        const subjectOverview = document.getElementById('subject_overview').value;
        const subjectType = document.getElementById('subject_type').value;

        fetch('http://127.0.0.1:8000/add_subject/', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
                subject_id: subjectId,
                subject_name: subjectName,
                subject_level: subjectLevel,
                parent_subject: parentSubject,
                subject_overview: subjectOverview,
                subject_type: subjectType,
            }),
        })
        .then(response => response.json())
        .then(data => {
            alert("科目已添加!");
            location.reload(); // Reload to see new subject
        })
        .catch(error => console.error('Error:', error));
    });

    function deleteSubject(subjectId) {
        if (confirm("您确定要删除这个科目吗?")) {
            fetch(`http://127.0.0.1:8000/delete_subject/${subjectId}/`, { method: 'DELETE' })
                .then(response => {
                    if (!response.ok) {
                        throw new Error('网络响应出错');
                    }
                    return response.json();
                })
                .then(data => {
                    alert("科目已删除!");
                    location.reload(); // Reload to see updated subject list
                })
                .catch(error => console.error('Error:', error));
        }
    }

    function editSubject(subjectId) {
        fetch(`http://127.0.0.1:8000/get_subject/${subjectId}/`)
            .then(response => {
                if (!response.ok) {
                    throw new Error('科目未找到，请检查ID。');
                }
                return response.json();
            })
            .then(data => {
                document.getElementById('edit_subject_id').value = subjectId;
                document.getElementById('edit_subject_name').value = data.subject_name;
                document.getElementById('edit_subject_level').value = data.subject_level;
                document.getElementById('edit_parent_subject').value = data.parent_subject;
                document.getElementById('edit_subject_overview').value = data.subject_overview;
                document.getElementById('edit_subject_type').value = data.subject_type;

                var editModal = new bootstrap.Modal(document.getElementById('editSubjectModal'));
                editModal.show();
            })
            .catch(error => {
                console.error('Error:', error);
                alert(error.message);
            });
    }

    document.getElementById('update-subject-btn').addEventListener('click', () => {
        const subjectId = document.getElementById('edit_subject_id').value;
        const subjectName = document.getElementById('edit_subject_name').value;
        const subjectLevel = document.getElementById('edit_subject_level').value;
        const parentSubject = document.getElementById('edit_parent_subject').value;
        const subjectOverview = document.getElementById('edit_subject_overview').value;
        const subjectType = document.getElementById('edit_subject_type').value;

        fetch(`http://127.0.0.1:8000/edit_subject/${subjectId}/`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
                subject_name: subjectName,
                subject_level: subjectLevel,
                parent_subject: parentSubject,
                subject_overview: subjectOverview,
                subject_type: subjectType,
            }),
        })
        .then(response => {
            if (!response.ok) {
                throw new Error('网络响应出错');
            }
            return response.json();
        })
        .then(data => {
            alert("科目已更新!");
            location.reload();
        })
        .catch(error => console.error('Error:', error));
    });

    // 加载考生信息
    fetch('http://127.0.0.1:8000/stu')
        .then(response => response.json())
        .then(data => {
            const studentsTableBody = document.getElementById('students-table-body');
            studentsTableBody.innerHTML = '';

            data.students_info.forEach(student => {
                const row = document.createElement('tr');
                row.innerHTML = `
                    <td>${student.idnumber}</td>
                    <td>${student.name}</td>
                    <td>${student.examnumber}</td>
                    <td>${student.origin}</td>
                    <td>${student.undergradmajor}</td>
                    <td>${student.undergradschool}</td>
                    <td>${student.email}</td>
                    <td>${student.phone}</td>
                    <td>
                        <button class="btn btn-warning btn-sm" onclick="editStudent('${student.idnumber}')">修改</button>
                        <button class="btn btn-danger btn-sm" onclick="deleteStudent('${student.idnumber}')">删除</button>
                    </td>
                `;
                studentsTableBody.appendChild(row);
            });

            const searchInput = document.getElementById('search-input-student');
            searchInput.addEventListener('input', () => {
                const searchTerm = searchInput.value.toLowerCase();
                const rows = studentsTableBody.querySelectorAll('tr');
                rows.forEach(row => {
                    const studentName = row.querySelector('td:nth-child(2)').textContent.toLowerCase();
                    row.style.display = studentName.includes(searchTerm) ? '' : 'none';
                });
            });
        })
        .catch(error => console.error('Error:', error));

    // 添加学生
    document.getElementById('save-student-btn').addEventListener('click', () => {
        const idnumber = document.getElementById('idnumber').value;
        const name = document.getElementById('name').value;
        const examnumber = document.getElementById('examnumber').value;
        const origin = document.getElementById('origin').value;
        const undergradmajor = document.getElementById('undergradmajor').value;
        const undergradschool = document.getElementById('undergradschool').value;
        const email = document.getElementById('email').value;
        const phone = document.getElementById('phone').value;

        fetch('http://127.0.0.1:8000/add_student/', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
                idnumber,
                name,
                examnumber,
                origin,
                undergradmajor,
                undergradschool,
                email,
                phone,
            }),
        })
        .then(response => response.json())
        .then(data => {
            alert("学生已添加!");
            location.reload();
        })
        .catch(error => console.error('Error:', error));
    });

    // 编辑学生
    function editStudent(idnumber) {
        fetch(`http://127.0.0.1:8000/get_student/${idnumber}/`)
        .then(response => {
            if (!response.ok) {
                throw new Error('学生未找到');
            }
            return response.json();
        })
        .then(data => {
            document.getElementById('edit_idnumber').value = idnumber;
            document.getElementById('edit_name').value = data.name;
            document.getElementById('edit_examnumber').value = data.examnumber;
            document.getElementById('edit_origin').value = data.origin;
            document.getElementById('edit_undergradmajor').value = data.undergradmajor;
            document.getElementById('edit_undergradschool').value = data.undergradschool;
            document.getElementById('edit_email').value = data.email;
            document.getElementById('edit_phone').value = data.phone;

            var editModal = new bootstrap.Modal(document.getElementById('editStudentModal'));
            editModal.show();
        })
        .catch(error => console.error('Error:', error));
    }

    // 更新学生信息
    document.getElementById('update-student-btn').addEventListener('click', () => {
        const idnumber = document.getElementById('edit_idnumber').value;
        const name = document.getElementById('edit_name').value;
        const examnumber = document.getElementById('edit_examnumber').value;
        const origin = document.getElementById('edit_origin').value;
        const undergradmajor = document.getElementById('edit_undergradmajor').value;
        const undergradschool = document.getElementById('edit_undergradschool').value;
        const email = document.getElementById('edit_email').value;
        const phone = document.getElementById('edit_phone').value;

        fetch(`http://127.0.0.1:8000/edit_student/${idnumber}/`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
                name,
                examnumber,
                origin,
                undergradmajor,
                undergradschool,
                email,
                phone,
            }),
        })
        .then(response => {
            if (!response.ok) {
                throw new Error('请求失败');
            }
            return response.json();
        })
        .then(data => {
            alert("学生已更新!");
            location.reload();
        })
        .catch(error => console.error('Error:', error));
    });

    // 删除学生
    function deleteStudent(idnumber) {
        if (confirm("您确定要删除这个考生吗?")) {
            fetch(`http://127.0.0.1:8000/delete_student/${idnumber}/`, { method: 'DELETE' })
                .then(response => {
                    if (!response.ok) {
                        throw new Error('网络响应出错');
                    }
                    return response.json();
                })
                .then(data => {
                    alert("学生已删除!");
                    location.reload(); // Reload to see updated students
                })
                .catch(error => console.error('Error:', error));
        }
    }

    // 加载招生信息
    fetch('http://127.0.0.1:8000/enro')
    .then(response => response.json())
    .then(data => {
        const admissionsTableBody = document.getElementById('admissions-table-body');
        admissionsTableBody.innerHTML = '';

        data.enrollments_info.forEach(admission => {
            const row = document.createElement('tr');
            row.innerHTML = `
                <td>${admission.subjectid}</td>
                <td>${admission.subjectdirection}</td>
                <td>${admission.subjectexam}</td>
                <td>${admission.subjectretest}</td>
                <td>${admission.annualquota}</td>
                <td>${admission.extraquota}</td>
                <td>${admission.year}</td>
                <td>${admission.eligible}</td>
                <td>${admission.instructorid}</td>
                <td>
                    <button class="btn btn-warning btn-sm"
                            data-subjectid="${admission.subjectid}"
                            data-subjectdirection="${admission.subjectdirection}"
                            data-subjectexam="${admission.subjectexam}"
                            data-subjectretest="${admission.subjectretest}"
                            data-annualquota="${admission.annualquota}"
                            data-extraquota="${admission.extraquota}"
                            data-year="${admission.year}"
                            data-eligible="${admission.eligible}"
                            data-instructorid="${admission.instructorid}"
                            onclick="editEnrollment(this)">修改</button>
                    <button class="btn btn-danger btn-sm" onclick="deleteEnrollment(${admission.instructorid})">删除</button>
                </td>
            `;
            admissionsTableBody.appendChild(row);
        });

        const searchInputAdmission = document.getElementById('search-input-admission');
        searchInputAdmission.addEventListener('input', () => {
            const searchTerm = searchInputAdmission.value.toLowerCase();
            const rows = admissionsTableBody.querySelectorAll('tr');
            rows.forEach(row => {
                const subjectDirection = row.querySelector('td:nth-child(2)').textContent.toLowerCase();
                row.style.display = subjectDirection.includes(searchTerm) ? '' : 'none';
            });
        });
    })
    .catch(error => console.error('Error fetching admissions data:', error));

    // 添加招生信息
    document.getElementById('save-admission-btn').addEventListener('click', () => {
        const subjectid = document.getElementById('add-admission-subjectid').value;
        const subjectdirection = document.getElementById('add-admission-subjectdirection').value;
        const subjectexam = document.getElementById('add-admission-subjectexam').value;
        const subjectretest = document.getElementById('add-admission-subjectretest').value;
        const annualquota = document.getElementById('add-admission-annualquota').value;
        const extraquota = document.getElementById('add-admission-extraquota').value;
        const year = document.getElementById('add-admission-year').value;
        const eligible = document.getElementById('add-admission-eligible').value;
        const instructorid = document.getElementById('add-admission-instructorid').value;

        fetch('http://127.0.0.1:8000/add_enrollment/', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
                subjectid,
                subjectdirection,
                subjectexam,
                subjectretest,
                annualquota,
                extraquota,
                year,
                eligible,
                instructorid
            }),
        })
        .then(response => response.json())
        .then(data => {
            alert("招生信息已添加!");
            location.reload(); // Reload to see new admission
        })
        .catch(error => console.error('Error:', error));
    });

    // 编辑招生信息
    function editEnrollment(button) {
        const subjectId = button.dataset.subjectid;
        const subjectDirection = button.dataset.subjectdirection;
        const subjectExam = button.dataset.subjectexam;
        const subjectRetest = button.dataset.subjectretest;
        const annualQuota = button.dataset.annualquota;
        const extraQuota = button.dataset.extraquota;
        const year = button.dataset.year;
        const eligible = button.dataset.eligible;
        const instructorId = button.dataset.instructorid;

        // 填充模态框的字段
        document.getElementById('admission-subjectid').value = subjectId;
        document.getElementById('admission-subjectdirection').value = subjectDirection;
        document.getElementById('admission-subjectexam').value = subjectExam;
        document.getElementById('admission-subjectretest').value = subjectRetest;
        document.getElementById('admission-annualquota').value = annualQuota;
        document.getElementById('admission-extraquota').value = extraQuota;
        document.getElementById('admission-year').value = year;
        document.getElementById('admission-eligible').value = eligible;
        document.getElementById('admission-instructorid').value = instructorId;

        // 显示编辑模态框
        var editModal = new bootstrap.Modal(document.getElementById('editAdmissionModal'));
        editModal.show();
    }

    // 更新招生信息
    document.getElementById('update-admission-btn').addEventListener('click', () => {
        const subjectid = document.getElementById('admission-subjectid').value;
        const subjectdirection = document.getElementById('admission-subjectdirection').value;
        const subjectexam = document.getElementById('admission-subjectexam').value;
        const subjectretest = document.getElementById('admission-subjectretest').value;
        const annualquota = document.getElementById('admission-annualquota').value;
        const extraquota = document.getElementById('admission-extraquota').value;
        const year = document.getElementById('admission-year').value;
        const eligible = document.getElementById('admission-eligible').value === 'true';
        const instructorid = document.getElementById('admission-instructorid').value;

        fetch(`http://127.0.0.1:8000/edit_enrollment/${instructorid}/`, {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({
                subjectid,
                subjectdirection,
                subjectexam,
                subjectretest,
                annualquota,
                extraquota,
                year,
                eligible,
                instructorid,
            }),
        })
        .then(response => {
            if (!response.ok) {
                throw new Error('请求失败');
            }
            return response.json();
        })
        .then(data => {
            alert("招生信息已更新!");
            location.reload();
        })
        .catch(error => console.error('Error:', error));
    });

    // 删除招生信息
    function deleteEnrollment(instructorid) {
        if (confirm("您确定要删除这个招生信息吗?")) {
            fetch(`http://127.0.0.1:8000/delete_enrollment/${instructorid}/`).then(response => {
                if (!response.ok) {
                    throw new Error('网络响应出错');
                }
                return response.json();
            })
            .then(data => {
                alert("招生信息已删除!");
            })
            .catch(error => console.error('Error:', error));
            location.reload();
        }
    }


</script>
</body>
</html>